<div class="widget">
	<div class="widget-header bg-blue">
		<i class="widget-icon icon-notebook"></i> 
		<span class="widget-caption"> 班级管理 </span>
		<div class="widget-buttons">
			<a href="javascript:void(0);" onclick="handlerCancel(this);" title="关闭"
				 data-toggle="dispose" data-refresh-table="#table-classes"> <i class="fa fa-times"></i> </a> 
		</div>
	</div>
	<div class="widget-body">
		<!-- 学员信息 -->
		<div class="widget radius-bordered">
			<div class="widget-header bg-gold">
				<i class="widget-icon icon-notebook"></i> 
				<span class="widget-caption"> 本班学员 </span>
				<div class="widget-buttons buttons-bordered">
					<button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#common-modal" data-url="content/eam/classes/dialog/history.html" 
								  data-onshow="onHistoryShow" data-onhidden="onHistoryHidden"
								  data-extention="托班，仅上课周期范围内的时间，可以签到和请假。">
						<i class="glyphicon glyphicon-calendar"></i> 签到管理
					</button>
					<span class="btn btn-default btn-sm">
						<i class="fa fa-clock-o gray"></i> <span data-now data-format="YYYY-MM-DD HH:mm:ss"></span>
					</span>
				</div>
			</div>
			<div class="widget-body editor-body-sm">
				<table data-ajax="handlerSearch" 
							 data-method="post" 
							 data-id-field="id" 
							 data-unique-id="id" 
							 data-pagination="true" 
							 data-click-to-select="true" 
							 data-side-pagination="server" 
							 data-mobile-responsive="true" 
							 data-form-search="#search-form-student" id="table-student" class="bootstrap-table">
					<thead>
						<tr>
							<th data-field="id" data-visible="false"></th>
							<th data-field="student" 		data-align="center">姓名</th>
							<th data-field="birthday"		data-align="center">生日</th>
							<th data-field="moonage" 		data-align="center">月龄</th>
							<th data-field="totals" 		data-align="center">总月数</th>
							<th data-field="overDate" 	data-align="center">截止日期</th>
							<th data-field="status" 		data-align="center" data-width="120" data-formatter="renderStatus">当天到课情况</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>
		
		<!-- TODO 基本信息 -->
		<div class="widget radius-bordered mgbt-xs-10">
			<div class="widget-header">
				<i class="widget-icon icon-notebook"></i> 
				<span class="widget-caption"> 基本信息 </span>
			</div>
			<div class="widget-body editor-body-sm editor-body-classes">
				<!-- dynamic data -->
			</div>
		</div>
		
		<!-- TODO 老师信息 -->
		<div class="widget radius-bordered mgbt-xs-10" id="addTeacher">
			<div class="widget-header">
				<i class="widget-icon icon-notebook"></i> 
				<span class="widget-caption"> 本班老师 </span>
				<div class="widget-buttons buttons-bordered">
					<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#common-modal" data-url="content/eam/classes/dialog/teacher.html" data-onshow="onTeacherShow">
						<i class="fa fa-plus"></i>
					</button>
				</div>
			</div>
			<div class="widget-body editor-body-sm editor-body-teacher">
				<form class="table-editor" id="tables-form-teacher" data-validate="false">
					<table data-ajax="handlerSearch" 
								 data-method="post" 
								 data-id-field="id" 
								 data-unique-id="teacherid" 
								 data-pagination="true" 
								 data-click-to-select="true" 
								 data-side-pagination="server" 
								 data-mobile-responsive="true" 
								 data-form-source="#tables-form-teacher" 
								 data-form-target="#editor-form-teacher" 
								 data-form-search="#search-form-teacher" id="table-teacher" class="bootstrap-table">
						<thead>
							<tr>
								<th data-checkbox="true"></th>
								<th data-field="id" data-visible="false"></th>
								<th data-field="name" 		data-align="center">姓名</th>
								<th data-field="sex" 			data-align="center">性别</th>
								<th data-field="mobile" 	data-align="center">手机</th>
								<th data-field="method" 	data-align="center">收费方式</th>
								<th data-field="amount" 	data-align="center">费用</th>
								<th data-field="operator" data-align="center" data-width="100" data-formatter="renderOperator" data-table-target="teacher">操作</th>
							</tr>
						</thead>
					</table>
				</form>
			</div>
		</div>
		
		<!-- TODO 应到设置 -->
		<div class="widget radius-bordered mgbt-xs-10" id="addTeacher">
			<div class="widget-header">
				<i class="widget-icon icon-notebook"></i> 
				<span class="widget-caption"> 应到设置 </span>
				<div class="widget-buttons buttons-bordered">
					<button class="btn btn-info btn-sm" title="添加" data-toggle="tooltip" data-placement="top" onclick="handlerAddRow('#table-exclude')">
						<i class="fa fa-plus"></i>
					</button>
				</div>
			</div>
			<div class="widget-body editor-body-sm editor-body-teacher">
				<form class="table-editor form-inline" id="tables-form-exclude" data-validate="false">
				<div class="form-group" style="padding:10px 0;">
				    <label for="from">筛选月份：</label>
				    <div class="input-group date date-selector" id="date-month">
							<input id="yearMonth" type="text" class="form-control" placeholder="月份"> 
							<span class="input-group-addon">
								<span class="fa fa-calendar"></span>
							</span>
						</div>
						<button type="button" class="btn btn-primary" onclick="handlerFilter();">筛选</button>
					</div>
					<table data-ajax="handlerSearch" 
								 data-method="post" 
								 data-id-field="id" 
								 data-unique-id="id" 
								 data-pagination="true" 
								 data-click-to-select="true" 
								 data-side-pagination="server" 
								 data-mobile-responsive="true" 
								 data-form-source="#tables-form-exclude" 
								 data-form-target="#editor-form-exclude" 
								 data-form-search="#search-form-exclude" id="table-exclude" class="bootstrap-table">
						<thead>
							<tr>
								<th data-checkbox="true"></th>
								<th data-field="id" data-visible="false"></th>
								<th data-field="checkDate"	data-align="center">上课时间</th>
								<th data-field="students" 	data-align="center">应到人数</th>
								<th data-field="operator" 	data-align="center" data-width="100" data-formatter="renderOperator" data-table-target="exclude">操作</th>
							</tr>
						</thead>
					</table>
				</form>
			</div>
		</div>
		
	</div>
</div>

<!-- 提交 表单 ========================================================= -->
<form id="editor-form-classes" action="/miwawa/{dbname}/classes/update" method="post" 
			name="com.app.miwawa.api.eam.entity.Classes" data-custom-action="true">
			<input type="hidden" name="status" value="0">
			<input type="hidden" name="invalid" value="F">
</form>
<form id="editor-form-teacher" action="/miwawa/{dbname}/common/update" method="post" 
			name="com.app.miwawa.api.eam.entity.ClassesCharge">
			<input type="hidden" name="bean['teacherid']" id="teacherid">
			<input type="hidden" name="bean['classesid']" id="classesid">
			<input type="hidden" name="bean['status']" 		value="0">
			<input type="hidden" name="bean['invalid']" 	value="F">
</form>
<form id="editor-form-exclude" action="/miwawa/{dbname}/classes/record/save" method="post" data-custom-action="true">
			<input type="hidden" name="classesId">
			<input type="hidden" name="teacherId">
</form>
<form id="editor-form-check" action="/miwawa/{dbname}/common/save" method="post" 
			name="com.app.miwawa.api.eam.entity.StudentCheck">
			<input type="hidden" name="bean['status']" value="0">
			<input type="hidden" name="bean['invalid']" value="F">
</form>

<!-- 查询 表单 ========================================================= -->
<form id="search-form-student" action="/miwawa/{dbname}/common/search.json" method="post" 
			name="com.app.miwawa.api.eam.entity.view.StudentLesson">
			<input type="hidden" name="item" value="托班" data-search-group="and" data-search-operation="EQ">
			<input type="hidden" name="classesId" value="0" data-search-group="and" data-search-operation="EQ">
			<input type="hidden" data-search-sort="fromDate" data-search-order="desc">
</form>

<script type="text/javascript">
<!--
	require(['domReady'],function(domReady){
		domReady(function () {
			loadClasses();
			if(authstr.indexOf("miwawa.eam.teacher.add") < 0){
				jQuery("#addTeacher").hide();
			}
		});
	});
	
	// 加载班级信息
	var classes, $moment;
	function loadClasses(){
		jQuery.utils.nowtimer();
		
		classes = jQuery("#table-classes").data("selectedRow");
		
		jQuery(":hidden[name='classesId']").val(classes.id);
		jQuery(":hidden[name='classesid']").val(classes.id);
		jQuery(":hidden[name='year']").val($moment().format("YYYY"));
		jQuery(":hidden[name='month']").val($moment().format("MM"));
		
		// 加载表单模版
		jQuery(".form-viewer-classes").loadform("data", classes);
		jQuery(".editor-body-classes").loadform("load", {
			templateId: "#edit-classes-template-dc",
			templatePath: "/miwawa/content/eam/classes/template.html",
			templateData: classes,
			templateHelper:{
				"select":function(value, target){
					require(['jquery.plugin.form'],function(form){
						form.chosen(target).select(target,{
							querys:{"invalid_EQ":"F","type_EQ":"托班"} 
						},function(chosen){
							jQuery("option:contains('"+value+"')", chosen).attr("selected","selected").trigger('chosen:updated');
						});
					});
				},
				"times":function(){
					jQuery("#search-form-classestime").searched({offset:0,limit:0}, {
						success: function(data, status, xhr){
							for(var i in data.rows){
								jQuery(".select-type[value='"+data.rows[i].type+"']").attr("checked","checked");
								jQuery("option[value='"+data.rows[i].week+"']", "#"+data.rows[i].mode+"Week").attr("selected","selected");
								jQuery("#"+data.rows[i].mode+"Time").val(data.rows[i].time.substring(0,5));
								jQuery("#"+data.rows[i].mode+"id").val(data.rows[i].id);
							}
						}
					});
				}
			},
			onLoadSuccess: function(){
				require(['moment','jquery.plugin.form'],function(moment, form){
					$moment = moment;
					form.datepicker(".date-selector");
					form.datepicker(".time-selector",{format:"HH:mm"});
					form.chosen("#fromWeek").chosen("#overWeek");
				});
			}
		});
		
		// 加载老师列表
		jQuery("#table-teacher").bootstrapTable({
			onLoadSuccess:function(data){
				if(data && data.rows){
					var ids = [];
					jQuery.each(data.rows,function(i,o){ids.push(o.teacherid);});
					jQuery(":hidden[name='teacherId']").val(ids.join(","));
				}
			}
		});
		
		// 加载学员列表
		jQuery("#table-student").bootstrapTable();
		
		// 加载应到列表
		jQuery("#table-exclude").bootstrapTable({
			onLoadSuccess:function(data){
				require(['jquery.plugin.form'],function(form){
					form.tooltip("[data-toggle='tooltip']");
					form.datepicker('#date-month',{format:'YYYY-MM'});
				});
			}
		});
	}
	
	function renderLimit(value, row, index){
		return	row.id == "edit" ? value : 
				"<a class='btn btn-info	  btn-xs btn-table-op' id='edited' onclick='handlerUpdateLeave(this, \""+index+"\")' data-table-source='#table-teacher' data-rowdata='"+JSON.stringify(row)+"' data-toggle='tooltip' data-placement='top' title='修改最大请假次数'> <i class='ion-compose'></i> </a>"
	}
	
	function renderTopLimit(value, row, index){
		return	value < "0" ? "" : value;
	}
	
	function renderTopRested(value, row, index){
		if(row.toplimit < 0 ){
			return	value == "0" ? "" : value;
		}else{
			return value;
		}
	}
	
	// 更新请假次数上限
	var student;
	function handlerUpdateLeave(trigger, index){
		jQuery("[data-toggle='tooltip']","#table-student").tooltip("destroy");
		var _opts = jQuery(trigger).data();
		student = _opts.rowdata;
		jQuery("#table-student").bootstrapTable("updateRow",{
			index: index,
			row: createEditRows(_opts.rowdata, _opts.tableSource)
		});
		
		function createEditRows(row, target){
			return {
				id:   		"edit",
	      student: 	row.student,
	      birthday: row.birthday,
	      moonage: 	row.moonage,
	      totals: 	row.totals,
	      useing: 	row.useing,
	      rested: 	row.rested,
	      toplimit: createInputs('toplimit', row.toplimit),
	      toprested:row.toprested,
	      operator: createButtons(),
	      status: 	renderstatus(row.status,row,index)
			};
		}
		// 创建输入框
		function createInputs(name, value){
			if(value < 0){
				 return '<input name="'+name+'" id="'+name+'" class="form-control" value="0">';
			}else{
				 return '<input name="'+name+'" id="'+name+'" class="form-control" value="'+value+'">';
			}
		}
		
		// 渲染班级学员列表的当天签到情况
		function renderstatus(value, row, index){
			if(row.id =="edit" ){
				return value ? '<a class="btn '+(value == '上课'?'btn-success':'btn-danger')+' btn-xs">'+value+","+row.checkDetail+'</a>' : value;
			}
		}
		
		// 创建按钮
 		function createButtons(){
			return ""
				+"<span>"
				+"	<button type='button' class='btn btn-success btn-xs' onclick='handSured()' title='确认'><i class='icon ion-checkmark-circled'></i></button>"
				+"	<button type='button' class='btn btn-danger btn-xs' onclick='handCanced()' title='取消'><i class='icon ion-close-circled'></i></button>"
				+"</span>";
		}
		
	}
		
 		function handSured(){
 			if((/^[1-9]\d*|0$/).test(jQuery("#toplimit").val()) == false){
 				jQuery.message.warning("请假次数只能为非负整数!");
 				return ;
 			}else{
	 			jQuery.ajaxsend({
	 				url:"/miwawa/{dbname}/common/update".replace("{dbname}", dbname),
	 				data:{
	 					entityClass:"com.app.miwawa.api.eam.entity.StudentLeaveLimit",
	 					"bean":{
	 						"id":student.leavelimitId,
	 						"topLimit":jQuery("#toplimit").val()
	 						}
	 				},
	 				success:function(data){
	 					if(!data.error) {
	 						jQuery("#table-student").bootstrapTable("refresh");
	 					}else{
	 						jQuery.message.warning(data.error);
	 					}
	 				}
				});
 			}
		}
 		
 		function handCanced(){
 			jQuery("#table-student").bootstrapTable("refresh");
 		}
		
	
	// 切换签到历史的日期
	function handlerSwitch(week){
		var curdate = $moment();
		var fromdate = jQuery('#classes-time').data("from.date");
		var overdate = jQuery('#classes-time').data("over.date");
		switch(week){
			case -1:
				createHistory($moment(fromdate).add(week, 'w'));
			return;
			case 0:
				createHistory(curdate);
			return;
			case 1:
				createHistory($moment(overdate).add(week, 'w'));
			return;
		}
	}
	
	// 查询签到历史数据并创建列表
	function createHistory(nowdate){
		var from = $moment(nowdate).startOf('isoWeek');
		var over = $moment(nowdate).endOf('isoWeek');
		jQuery("#classes-time").text(from.format('YYYY年MM月DD日')+" - "+over.format('YYYY年MM月DD日'));
		jQuery("#classes-time").data("from.date",from.format('YYYY-MM-DD'));
		jQuery("#classes-time").data("over.date",over.format('YYYY-MM-DD'));
		var columns = getColumns($moment(from), $moment(over));
		
		jQuery.ajaxsend({
			url:"/miwawa/{dbname}/classes/check/history".replace("{dbname}",dbname),
			data:{
				"item":"托班",
				"checkDate":from.format('YYYY-MM-DD'),
				"classesId":classes.id
			},
			success:function(data){
				if(data){
					jQuery("#table-history").bootstrapTable("refreshOptions",{ columns:columns, data:data });
				}
			}
		});
	}
	
	// 返回签到历史表头
	function getColumns(from, over){
		var colums = [{checkbox:true},{field: 'student', title: '会员', align: 'center'}];
		var fromWeek = jQuery.utils.week[jQuery("#fromWeek").val()];
		var overWeek = jQuery.utils.week[jQuery("#overWeek").val()];
		
		for(;from <= over;from.add(1, 'd')){
			var week = from.day();
			var weeks = jQuery.utils.weeks[week];
			var title = from.format('YYYY-MM-DD');
			if(fromWeek <= week && week <= overWeek){
				colums.push({
					field: title, 
					title: createTitle(title, weeks)+createButton(title), 
					align: 'center', 
					formatter: 'renderWeek'
				});
			}
		}
		
		return colums;
	}
//-->
</script>